<template>
	<el-container>
		<el-main class='x-main-edit'>
			<el-form ref="form" :rules="form_rules" :model="form" size="mini" label-width="15%">
				<el-tabs type="border-card" v-model="page_tag">
					<!---->
					<!---->
					<el-tab-pane :label="page_info.title" name="1">
						<el-form-item label="服务" prop="dorder_service">
							<el-select filterable v-model="form.dorder_service" placeholder="请选择">
								<el-option v-for="(val, k) in page_info.list_service"
										   :label="val.abc_name"
										   :key="val.abc_id"
										   :value="val.abc_id">
								</el-option>
								<el-option label="其他" key="" value=""></el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="服务名称" prop="dorder_service_name">
							<el-input :disabled="form.dorder_service!=''" class="x-input-60" v-model="form.dorder_service_name"/>
						</el-form-item>
						<el-form-item v-show="!page_info.is_admin_edit" label="用户-ID" prop="dorder_openid">
							<UserSearch v-model="form.dorder_openid"></UserSearch>
						</el-form-item>
						<el-form-item v-if="page_info.is_admin_edit" label="用户-名称" prop="dorder_user_name">
							<el-input class="x-input-60" v-model="form.dorder_user_name"/>
						</el-form-item>
						<el-form-item v-if="page_info.is_admin_edit" label="用户-手机" prop="dorder_user_phone">
							<el-input class="x-input-60" v-model="form.dorder_user_phone"/>
						</el-form-item>
						<el-form-item label="要求" prop="dorder_step">
							<el-input class="x-input-60" v-model="form.dorder_step"/>
						</el-form-item>
						<el-form-item label="图" prop="dorder_pic_s">
							<x-upload-imgs ref="uploadEle" :sortable="true" :max-num="1"
										   :rules="({ maxSize: 2})"
										   :img_root="page_info.static_file_root"
										   v-bind:value.sync="form.dorder_pic_s"
										   :remote-fuc="g_page.funcUpdateImg"
										   :before-upload="g_page.funcUpdateImgBefore"/>
						</el-form-item>
						<el-form-item label="备注" prop="dorder_desc">
							<el-input class="x-input-60" type="textarea" v-model="form.dorder_desc"/>
						</el-form-item>
						<el-form-item label="送货地址" prop="dorder_address">
							<el-input class="x-input-60" type="textarea" v-model="form.dorder_address"/>
						</el-form-item>
						<el-form-item label="交货图" prop="dorder_pic">
							<x-upload-imgs ref="uploadEle" :sortable="true" :max-num="1"
										   :rules="({ maxSize: 2})"
										   :img_root="page_info.static_file_root"
										   v-bind:value.sync="form.dorder_pic"
										   :remote-fuc="g_page.funcUpdateImg"
										   :before-upload="g_page.funcUpdateImgBefore"/>
						</el-form-item>
						<el-form-item label="当前状态">
							<span>{{ form.state }}</span>
							<el-button type="primary" @click="form_dialog_v=true" size="mini">改变状态</el-button>
							<div v-if="errmsg.length>0" style="color:red;">errmsg:{{ errmsg }}</div>
						</el-form-item>
						<el-form-item label="预计完成时间" prop="dorder_done_date">
							{{ form.dorder_done_date }}
						</el-form-item>
						<el-form-item label="日志" prop="dorder_state_log">
							<div v-for="item in form.log">
								{{item}}
							</div>
						</el-form-item>
					</el-tab-pane>
					<!---->
					<!---->
					<el-tab-pane v-if="false" label="模板" name="2">
						<el-form-item label="应用模板" prop="reply_app_file" ref="reply_app_file">
							<el-col :span="6">
								<el-input v-model="form.reply_app_file" placeholder="默认：t_001"/>
							</el-col>
						</el-form-item>
					</el-tab-pane>
					<!---->
					<!---->
				</el-tabs>
			</el-form>
			<!---->
			<!---->
			<!-- 按钮部分 -->
			<div class="save_wrap">
				<el-button @click="g_page.funcBack" size="mini">返回</el-button>
				<el-button type="success" @click="g_page.funcSave" size="mini">保存</el-button>
				<el-checkbox v-if="page_info.is_admin_edit" style="margin-left: 10px;" label="保存后停留" v-model="checked"/>
			</div>
			<!---->
			<!---->
			<!---->
		</el-main>
		<!---->
		<!---->
		<!-- 弹框 -->
		<el-dialog title="改变状态" :visible.sync="form_dialog_v" width="50%">
			<el-form ref="form_dialog" :model="form_dialog" size="mini" label-width="15%">
				<el-form-item label="状态">
					<el-select filterable class="x-input-60" v-model="form_dialog.dorder_state">
						<el-option v-for="(item,index) in page_info.list_status"
								   :label="item"
								   :key="index"
								   :value="index">
						</el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="预计完成时间" prop="dorder_done_date">
					<el-date-picker
						style="width: 200px;"
						v-model="form_dialog.dorder_done_date"
						type="datetime"
						placeholder="预计完成时间"
						:picker-options="g_cc.picker_options"
						default-time="00:00:00"
						value-format="yyyy-MM-dd HH:mm:ss">
					</el-date-picker>
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="form_dialog_v=false" size="mini">取消</el-button>
				<el-button type="success" @click="funcChangeState" size="mini">确定</el-button>
			</div>
		</el-dialog>
		<!---->
		<!---->
		<!---->
	</el-container>
</template>

<script>
	import UserSearch from '@/components/UserSearch'

	export default {
		components: {
			UserSearch
		},
		data() {
			let page_data = {
				errmsg: '',
				form_dialog_v: false,
				form_dialog: {}
			}
			//
			page_data = this.g_cc.funcGetInitData(page_data)
			//
			return page_data
		},
		mounted() {
			console.log('mounted')
			console.log(this.$route.query)

			this.g_page.funcSetVue(this)
			//
			this.g_page.funcSetApiUrlEdit('/xadmin/app_drinfone/app_drinfone__order__edit')
			this.g_page.funcSetApiUrlSave('/xadmin/app_drinfone/app_drinfone__order__edit/save')
			let page = this
			//验证
			this.form_rules = {
				__test: [{
					required: true,
					message: '请输入原密码',
					trigger: 'blur'
				}]
			}

			let data = this.$route.query
			this.g_page.funcEdit(data)
		},
		methods: {
			funcShowDialogAfter() {
				console.log('funcShowDialogAfter')
			},
			//保存之前
			funcSaveBefore(data) {
				console.log('funcSaveBefore', data)

				return data
			},
			////////////////////
			funcChangeState() {
				this.g_cc.func_axios({
					url: '/xadmin/app_drinfone/app_drinfone__order__edit/funcChangeState',
					data: {
						order_id: this.form.id,
						state: this.form_dialog.dorder_state,
						done_date: this.form_dialog.dorder_done_date
					},
					success: (res) => {
						//
						if (res.data.errcode == 0) {
							this.g_cc.func_alert('成功', 'success', () => {
								this.g_page.funcReload()
							})
						} else {
							this.g_cc.func_alert(res.data.errmsg, 'error', () => {
								this.g_page.funcReload()
							})
						}
					}
					//
				})
			}
			////////////////////
		}
	}
</script>
